<template>
  <div class="news-list">
    <Swiper :options="swiperOption">
      <Swiper-slide v-for="(index) in 10" :key="index">
        <div class="news">
          5555555
        </div>
      </Swiper-slide>
    </Swiper>
  </div>
</template>

<script>
import {Swiper, SwiperSlide} from 'vue-awesome-swiper'

export default {
  name: "ContentList",
  data() {
    return {
      showCard: false,
      showComment: false,
      page: 0,
      datas: {},
      swiperOption: {
        direction: "vertical",
        grabCursor: true,
        setWrapperSize: true,
        autoHeight: true, //自动高度。设置为true时，wrapper和container会随着当前slide的高度而发生变化
        slidesPerView: 1,
        mousewheel: true,
        mousewheelControl: true,
        height: window.innerHeight, // 高度设置，占满设备高度
        resistanceRatio: 0,
        observeParents: true,
      },
    }
  },
  components: {
    Swiper,
    SwiperSlide
  }
}
</script>

<style scoped>
.news-list{
 position: relative;
  top: 29px;

}
.news-list .news{
  background-color: #e00a0a;
  width: 100%;
  height: 150px;
  margin: 5px 0;
  border-bottom: 1px #686767 solid;
}


</style>